<template>
    <!-- <pageTabelLayout> -->
    <!-- <template #pageHeader> -->
    <div class="search-form isheader" v-if="headerShow">
        <div>
            <a-form size="small" :model="pageData" layout="inline">
                <a-form-item label="出库单号">
                    <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="pageData.stockOutCode" />
                </a-form-item>
                <a-form-item label="开单日期" style="margin-left: 16px;">
                    <a-date-picker  popup-container="html"  class="bacClass" :style="{ width: '200px' }" v-model="pageData.beginDate" />
                </a-form-item>
                <a-form-item label="至" style="margin-left: 16px;">
                    <a-date-picker  popup-container="html"  class="bacClass" :style="{ width: '200px' }" v-model="pageData.endDate" />
                </a-form-item>
            </a-form>
        </div>
        <div style="float: right;">
            <Toolbar :items="toolbarList" @add="addHandler" @select="selectHandler" @del="deleteHandler"
                @export="EXELTABLE(tc2, pageData.dataListOP, '退料出库明细')" @audit="audits">
            </Toolbar>
        </div>
    </div>

    <div class="my-divisders">
        <a-divider orientation="center">
            <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18" />
            <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18" />
        </a-divider>
    </div>

    <!-- </template> -->
    <!-- <template #pageTabel> -->
    <div :style="{ height: '76vh', padding: '10px' }">
        <a-tabs   :lazy-load="true" :justify="true" :default-active-key="tabsKeys" @change="tabsChanges">
            <a-tab-pane title="未审核" :key="1">
                <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady"
                    style="height:94%" :defaultColDef="defaultColDef" class='ag-theme-alpine' :rowData="tableDataList"
                    :columnDefs="tc" :localeText="localeText1"></AgGridVuesCopys>
                <paginationCopys :page-size-options="pagingList1" :total="total" show-total show-jumper show-page-size
                    @change="PageSize" @page-size-change="change" style="justify-content: center"
                    :page-size="pagination.pageSize" :current="pagination.page" />
            </a-tab-pane>
            <a-tab-pane title="已审核" :key="2">
                <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady2"
                    style="height:94%" :defaultColDef="defaultColDef2" class='ag-theme-alpine'
                    :rowData="pageData.dataListOP" :columnDefs="tc2" :localeText="localeText1"></AgGridVuesCopys>
                <paginationCopys :page-size-options="pagingList1" :total="total1" show-total show-jumper show-page-size
                    @change="PageSize" @page-size-change="change" style="justify-content: center"
                    :page-size="pagination.pageSize" :current="pagination.page" />
            </a-tab-pane>
        </a-tabs>
    </div>
    <!-- </template> -->
    <a-drawer :drawer-style="{ 'zIndex': 999 }" :mask-closable="false" height="90%" :visible="pageData.showAdd8"
        unmountOnClose @ok="sideOk" @cancel="pageData.showAdd8 = false" cancel-text='关闭' ok-text='保存' placement="bottom">
        <template #title>
            {{ pageData.sideTitle }}
        </template>
        <div style="min-width:800px;">
            <div class="search-form isheader" v-show="headerShow">
                <a-form ref="formRef" size="small" :model="objectOP" layout="inline">
                    <a-form-item label="出库单号">
                        <a-input class="bacClass" disabled :style="{ width: '200px' }"
                            v-model="objectOP.stockOutCode"></a-input>
                    </a-form-item>
                    <a-form-item label="开单日期" :validate-trigger="['change', 'blur']"
                        :rules="[{ required: true, message: '开单日期必填' }]" field="stockOutDate">
                        <a-date-picker  popup-container="html"  class="bacClass" :style="{ width: '200px' }" v-model="objectOP.stockOutDate" />
                    </a-form-item>
                    <a-form-item label="仓库名称" :validate-trigger="['change', 'blur']"
                        :rules="[{ required: true, message: '仓库名称必填' }]" field="warehouseName">
                        <a-select popup-container="html"  class="bacClass" :style="{ width: '200px' }" :loading="loading" :allowClear="true"
                            v-model="objectOP.warehouseName" :filter-option="false" allow-search @search="handleSearch2"
                            @focus="focusSel2">
                            <a-option v-for="item in pageData.nameList2" :value="item['warehouseName']">{{
                                item['warehouseName']
                            }}</a-option>
                        </a-select>
                    </a-form-item>
                    <a-form-item label="计件日期">
                        <a-date-picker  popup-container="html"  class="bacClass" :style="{ width: '200px' }" v-model="objectOP.reckonPieceDate" />
                    </a-form-item>
                    <a-form-item label="出库类型">
                        <a-input disabled class="bacClass" :style="{ width: '200px' }"
                            v-model="objectOP.stockOutTypeName" />
                    </a-form-item>
                    <CorporateSectorCascader :style="{ width: '200px' }" :configCascader="configCascader"
                        @changeCascader="changeCascader" />
                    <a-form-item label="备注">
                        <a-input class="bacClass" :style="{ width: '600px' }" v-model="objectOP.remark"></a-input>
                    </a-form-item>
                </a-form>
            </div>
        </div>

        <div style="margin: 5px 0px 15px 15px;">
            <el-button style="color:#165dff;" class="gesture" link>库存明细</el-button>
            <el-button style="color:#165dff;" class="gesture" link @click="delet">删除</el-button>
            <el-button style="color:#165dff;" class="gesture" link @click="lookSet">库存明细查询</el-button>

        </div>

        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady1_2" style="height:80%"
            :defaultColDef1_2="defaultColDef1_2" class='ag-theme-alpine' :rowData="tableDataList1_2" :columnDefs="dc2"
            :localeText="localeText1"></AgGridVuesCopys>
    </a-drawer>
    <a-modal v-model:visible="visiblecg" ok-text="确定" @ok="print" :width="1200">
        <div class="contioner" style="height: 100%;">
            <div class="search-form isheader" v-show="headerShow" v-if="query.isDoes == false">
                <a-form size="small" :model="query" layout="inline">
                    <a-form-item label="坯布编号">
                        <a-input allow-clear v-model="query.greyCode" :style="{ width: '200px' }" class="bacClass" />
                    </a-form-item>
                    <a-form-item label="坯布名称">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.greyName" />
                    </a-form-item>
                    <a-form-item label="计划单号">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.customOrderCode" />
                    </a-form-item>
                    <a-form-item label="客户名称">
                        <a-input allow-clear :style="{ width: '180px' }" class="bacClass" v-model="query.custumName" />
                    </a-form-item>
                    <a-form-item label="托盘编号" label-width="90px">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.shelvesCode" />
                    </a-form-item>
                    <a-form-item label="库位" label-col-flex="65px">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.storageName" />
                    </a-form-item>
                    <a-form-item label="流转卡号" label-width="90px">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.circulatCard" />
                    </a-form-item>
                    <a-form-item label="布号" label-col-flex="65px">
                        <a-input allow-clear :style="{ width: '200px' }" class="bacClass" v-model="query.clothCode" />
                    </a-form-item>
                </a-form>
            </div>
            <div class="my-tool-bar" style="margin-bottom: 5px">
                <a-space>
                    <el-button @click="getList" type="primary" :icon="Search">查询</el-button>
                    <!-- <el-button plain @click="splitAdjustment">拆分</el-button> -->
                </a-space>
            </div>
            <div :style="{ height: '400px', padding: '10px' }">
                <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" v-loading="loadingElplus" rowSelection="multiple"
                    @grid-ready="gridReady5" style="height: 90%" :defaultColDef="defaultColDef" class="ag-theme-alpine"
                    :rowData="pageData.dataList" :columnDefs="tableColumns" :localeText="localeText1"></AgGridVuesCopys>
                <paginationCopys :total="pageData.total" show-total show-jumper show-page-size @change="PageSize"
                    @page-size-change="changeSize" style="justify-content: center" :page-size="query.size"
                    :current="query.page" :page-size-options="pagingList1" />
            </div>
        </div>
    </a-modal>
    <!-- 详情弹窗 -->
    <a-drawer :drawer-style="{ 'zIndex': 999 }" :mask-closable="false" height="90%" :visible="pageData.showAdd9" hide-cancel
        unmountOnClose @ok="sideOk1" @cancel="pageData.showAdd9 = false" ok-text='关闭' placement="bottom">
        <template #title>
            退料详情
        </template>
        <div style="min-width:800px;">
            <div class="search-form isheader" v-show="headerShow">
                <a-form size="small" :model="objectOP" layout="inline">
                    <a-form-item label="出库单号">
                        <a-input class="bacClass" disabled :style="{ width: '200px' }"
                            v-model="objectOP.stockOutCode"></a-input>
                    </a-form-item>
                    <a-form-item label="开单日期">
                        <a-date-picker  popup-container="html"  class="bacClass" disabled :style="{ width: '200px' }"
                            v-model="objectOP.stockOutDate" />
                    </a-form-item>
                    <a-form-item label="仓库名称">
                        <a-select popup-container="html"  class="bacClass" disabled :style="{ width: '200px' }" :loading="loading"
                            :allowClear="true" v-model="objectOP.warehouseName" :filter-option="false" allow-search
                            @search="handleSearch2" @focus="focusSel2">
                            <a-option v-for="item in pageData.nameList2" :value="item['warehouseName']">{{
                                item['warehouseName']
                            }}</a-option>
                        </a-select>
                    </a-form-item>
                    <a-form-item label="计件日期">
                        <a-date-picker  popup-container="html"  class="bacClass" disabled :style="{ width: '200px' }"
                            v-model="objectOP.reckonPieceDate" />
                    </a-form-item>
                    <a-form-item label="送货单位">
                        <a-input class="bacClass" disabled :style="{ width: '200px' }"
                            v-model="objectOP.SHintypeName"></a-input>
                    </a-form-item>
                    <a-form-item label="备注">
                        <a-input class="bacClass" disabled :style="{ width: '600px' }" v-model="objectOP.remark"></a-input>
                    </a-form-item>
                </a-form>
            </div>
        </div>
        <div style="margin: 5px 0px 15px 15px;">
            <el-button style="color:#165dff;" class="gesture" link>库存明细</el-button>
        </div>
        <AgGridVuesCopys :rowHeight="33" :headerHeight="33" :suppressCopyRowsToClipboard="true" rowSelection="multiple" @grid-ready="gridReady1_2" style="height:80%"
            :defaultColDef1_2="defaultColDef1_2" class='ag-theme-alpine' :rowData="tableDataList1_2" :columnDefs="dc2"
            :localeText="localeText1"></AgGridVuesCopys>
    </a-drawer>
    <!-- </pageTabelLayout> -->
</template>
<script setup lang="ts">
import {
    useTable,
    useRowKey,
    useTableColumn,
    usePagination,
    useRowSelection,
} from "@/hooks/table";
import { ref, reactive } from "vue"
import { post, get } from "@/api/http"
import { localeText } from '@/api/aggridZw'

import Toolbar from "@/components/Toolbar.vue"
import { Message, Modal } from "@arco-design/web-vue"
import { Search, Download, Printer } from '@element-plus/icons-vue'
import { FormInstance } from "@arco-design/web-vue/es/form";
import { pagingList } from "@/api/paging";
import CorporateSectorCascader from '@/components/corporateSectorCascader1/index.vue'
import { EXPORTEXEL, EXELTABLE } from '@/utils/exportEXCEL'
const toolbarList: any = ref(['查询', '新增', '删除', '审核'])
let isIDs: any = ref(1);

let configCascader = ref<{}>({
    corporateWidth: '180px', //公司宽度
    sectorWidth: '180px', //部门宽度
    corporateRquired: true, //公司是否必填
    sectorRquired: true, //部门是否必填
    size: 'small', //选择框大小'mini' | 'small' | 'medium' | 'large'
    corporateName: '送货单位', //公司label
    sectorName: '选择部门', //部门label
    cascaderShow: 'sector', //配置部门不显示
})

const changeCascader = (data: any) => {
    objectOP.deliveryDepartmentId = data.corporateId
    objectOP.deliveryDepartmentName = data.corporateLabel
    // console.log(data, '11111111111111111');
    if (data.corporateId != '' || data.corporateLabel != '') {
        post({
            url: "/dwWms/BlankStockOut/getCodeGenerate",
            data: {
                stockOutTypeId: 53,
                deliveryDepartmentName: data.corporateLabel
            }
        }).then(({ code, data, message }: any) => {
            if (code === 200) {
                objectOP.stockOutCode = data
            }
        });
    }
    const { corporateId } = data
    // whList.value = []
    // searchData.wh = ''
    // searchData.firm = corporateId
    // whService.getWarhouseList(corporateId, '原纱仓')
}
function PageSize(val: any) {
    if (isIDs.value == 1) {
        pagination.page = val
        doRefresh();
    } else if (isIDs.value == 2) {
        pagination2.page = val
        doRefresh1();
    }
}

function change(val: any) {
    if (isIDs.value == 1) {
        pagination.pageSize = val
        doRefresh();
    } else {
        pagination2.pageSize = val
        doRefresh1();
    }
}


const headerShow = ref(true)

const tableDataList = ref([])

const tableDataList1 = ref([])

const tableDataList1_2: any = ref([])


const gridOption = ref()
const gridReady = (params: any) => {
    gridOption.value = params.api
}

const gridOption5 = ref()
const gridReady5 = (params: any) => {
    gridOption5.value = params.api
}

const gridOption2 = ref()
const gridReady2 = (params: any) => {
    gridOption2.value = params.api
}

const gridOption1_2 = ref()
const gridReady1_2 = (params: any) => {
    gridOption1_2.value = params.api
}

const defaultColDef = {
    sortable: true,
    resizable: true,
    filter: true,
}

const defaultColDef2 = {
    sortable: true,
    resizable: true,
    filter: true,
}


const defaultColDef1_2 = {
    sortable: true,
    resizable: true,
    filter: true,
}

const localeText1: any = ref(localeText)

const tc = [
    {
        showRowGroup: 'hide_def',
        "headerName": "",
        "checkboxSelection": true,
        "headerCheckboxSelection": true,
        "pinned": "left",
        "width": 50,
        resizable: false,
        filter: false,
        sortable: false,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: "left",
    },
    {
        headerName: '出库单号',
        field: 'stockOutCode',
        width: 150
    },
    {
        headerName: '开单日期',
        field: 'stockOutDate',
        width: 150
    },
    {
        headerName: '仓库名称',
        field: 'warehouseName',
        width: 150
    },
    {
        headerName: '计件日期',
        field: 'reckonPieceDate',
        width: 150
    },
    {
        headerName: '出库类型',
        field: 'stockOutTypeName',
        width: 150
    },
    {
        headerName: '备注',
        field: 'remark',
        width: 150
    },
    {
        headerName: '创建人',
        field: 'createName',
        width: 150
    },
    {
        headerName: '创建时间',
        field: 'createTime',
        width: 150
    },
    {
        headerName: '修改人',
        field: 'updateName',
        width: 150
    },
    {
        headerName: '修改时间',
        field: 'updateTime',
        width: 150
    },
    {
        headerName: '状态',
        field: 'auditState',
        pinned: 'right',
        width: 150,
        cellRenderer: {
            template: `
            <a-space>
                    <el-tag type="success" class="gesture">未审核</el-tag>
                </a-space>
            `,
            setup(props: any) {
                return {
                    auditState: props.params.data.auditState
                }
            }
        }
    },
    {
        headerName: '操作',
        field: 'id',
        pinned: 'right',
        width: 150,
        cellRenderer: {
            template: `
            <el-button style="color:#165dff;" @click="a" class="gesture" link>修改</el-button>
            `,
            setup(props: any) {
                const a = () => {
                    editHandler(props.params.data)
                }
                return {
                    a
                }
            }
        }
    }
]
const tc2 = [
    {
        showRowGroup: 'hide_def',
        "headerName": "",
        "checkboxSelection": true,
        "headerCheckboxSelection": true,
        "pinned": "left",
        "width": 50,
        resizable: false,
        filter: false,
        sortable: false,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: "left",
    },
    {
        headerName: '出库单号',
        field: 'stockOutCode',
        width: 150
    },
    {
        headerName: '开单日期',
        field: 'stockOutDate',
        width: 150
    },
    {
        headerName: '仓库名称',
        field: 'warehouseName',
        width: 150
    },
    {
        headerName: '计件日期',
        field: 'reckonPieceDate',
        width: 150
    },
    {
        headerName: '出库类型',
        field: 'stockOutTypeName',
        width: 150
    },
    {
        headerName: '备注',
        field: 'remark',
        width: 150
    },
    {
        headerName: '创建人',
        field: 'createName',
        width: 150
    },
    {
        headerName: '创建时间',
        field: 'createTime',
        width: 150
    },
    {
        headerName: '修改人',
        field: 'updateName',
        width: 150
    },
    {
        headerName: '修改时间',
        field: 'updateTime',
        width: 150
    },
    {
        headerName: '状态',
        field: 'auditState',
        pinned: 'right',
        width: 150,
        cellRenderer: {
            template: `
            <a-space>
                    <el-tag type="success" class="gesture">已审核</el-tag>
                </a-space>
            `,
            setup(props: any) {
                return {
                    auditState: props.params.data.auditState
                }
            }
        }
    },
    {
        headerName: '操作',
        field: 'id',
        pinned: 'right',
        width: 150,
        cellRenderer: {
            template: `
            <el-button style="color:#165dff;" @click="a" class="gesture" link>详情</el-button>
            `,
            setup(props: any) {
                const a = () => {
                    editHandler1(props.params.data)
                }
                return {
                    a
                }
            }
        }
    }
]
const dc2 = [
    {
        showRowGroup: 'hide_def',
        "headerName": "",
        "checkboxSelection": true,
        "headerCheckboxSelection": true,
        "pinned": "left",
        "width": 50,
        resizable: false,
        filter: false,
        sortable: false,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: "left",
    },
    {
        headerName: '收料单号',
        field: 'deliveryCode',
        width: 150,
    },
    {
        headerName: '送货单位',
        field: 'deliveryDepartmentName',
        width: 150
    },
    {
        headerName: '客户订单号',
        field: 'customOrderCode',
        width: 150
    },
    {
        headerName: '客户名称',
        field: 'customName',
        width: 150
    },
    {
        headerName: '计划单号',
        field: 'planOrderCode',
        width: 150
    },
    {
        headerName: '色号',
        field: 'colorCode',
        width: 150
    },
    {
        headerName: '坯布编号',
        field: 'greyCode',
        width: 150
    },
    {
        headerName: '坯布名称',
        field: 'greyName',
        width: 150
    },
    {
        headerName: '条码号',
        field: 'clothfiyCode',
        width: 150,
    },
    {
        headerName: '托盘编号',
        field: 'shelveCode',
        width: 150
    },
    {
        headerName: '织造序号',
        field: 'weaveCode',
        width: 150
    },
    {
        headerName: '车号',
        field: 'barcode',
        width: 150
    },
    {
        headerName: '匹号',
        field: 'horseNo',
        width: 150
    },
    {
        headerName: '色称',
        field: 'colorName',
        width: 150,
    },
    {
        headerName: '库位',
        field: 'storageName',
        width: 150
    },
    {
        headerName: '等级',
        field: 'grade',
        width: 150
    },
    {
        headerName: '门幅',
        field: 'width',
        width: 200,
    },
    {
        headerName: '克重',
        field: 'gramWeight',
        width: 200,
    },
    {
        headerName: '尺寸',
        field: 'inch',
        width: 150,
    },
    {
        headerName: '重量',
        field: 'weight',
        width: 150
    },
    {
        headerName: '纱批',
        field: 'yarnBatch',
        width: 150
    },
]
const tableColumns = [
    {
        showRowGroup: 'hide_def',
        headerName: '',
        checkboxSelection: true,
        headerCheckboxSelection: true,
        pinned: 'left',
        width: 50,
        resizable: false,
        filter: false,
        sortable: false,
        minWidth: 50,
        maxWidth: 50,
        lockPosition: 'left',
    },
    {
        headerName: '入库单号',
        field: 'stockInCode',
        width: 150,
    },

    {
        headerName: '入库时间',
        field: 'stockInDate',
        width: 150,
    },
    {
        headerName: '入库人',
        field: 'stockInName',
        width: 150,
    },
    {
        headerName: '收料单号',
        field: 'deliveryCode',
        width: 150,
    },
    {
        headerName: '入库类型',
        field: 'stockInTypeName',
        width: 200,
    },
    {
        headerName: '客户订单号',
        field: 'customOrderCode',
        width: 200,
    },
    {
        headerName: '计划单号',
        field: 'planOrderCode',
        width: 200,
    },
    {
        headerName: '织造序号',
        field: 'weaveCode',
        width: 200,
    },
    {
        headerName: '客户名称',
        field: 'customName',
        width: 200,
    },
    {
        headerName: '公司',
        field: 'companyName',
        width: 200,
    },
    {
        headerName: '仓库名称',
        field: 'warehouseName',
        width: 200,
    },
    {
        headerName: '区域',
        field: 'areaName',
        width: 200,
    },
    {
        headerName: '库位',
        field: 'storageName',
        width: 200,
    },
    {
        headerName: '托盘编号',
        field: 'shelveCode',
        width: 200,
    },
    {
        headerName: '布笼名称',
        field: 'shelveName',
        width: 200,
    },
    {
        headerName: '送货单位',
        field: 'deliveryDepartmentName',
        width: 200,
    },
    {
        headerName: '品名',
        field: 'brandName',
        width: 200,
    },
    {
        headerName: '色号',
        field: 'colorCode',
        width: 200,
    },
    {
        headerName: '坯布编号',
        field: 'greyCode',
        width: 150,
    },
    {
        headerName: '坯布名称',
        field: 'greyName',
        width: 200,
    },
    {
        headerName: '匹号',
        field: 'horseNo',
        width: 200,
    },
    {
        headerName: '单位',
        field: 'unit',
        width: 200,
    },
    {
        headerName: '等级',
        field: 'grade',
        width: 200,
    },
    {
        headerName: '条码号',
        field: 'clothfiyCode',
        width: 200,
    },
    {
        headerName: '尺寸',
        field: 'inch',
        width: 200,
    },
    {
        headerName: '重量',
        field: 'weight',
        width: 200,
    },
    {
        headerName: '单价',
        field: 'price',
        width: 200,
    },
    {
        headerName: '金额',
        field: 'amount',
        width: 200,
    },
    {
        headerName: '收货单位',
        field: 'shipAddress',
        width: 200,
    },
    {
        headerName: '车牌',
        field: 'carPlate',
        width: 200,
    },
    {
        headerName: '门幅',
        field: 'width',
        width: 200,
    },
    {
        headerName: '克重',
        field: 'gramWeight',
        width: 200,
    },
    {
        headerName: '纱批',
        field: 'yarnBatch',
        width: 200,
    },
    {
        headerName: '流转卡号',
        field: 'circulatCard',
        width: 200,
    },
    {
        headerName: '收货单位',
        field: 'shipAddress',
        width: 200,
    },
    {
        headerName: '创建人',
        field: 'createName',
        width: 200,
    },
    {
        headerName: '创建时间',
        field: 'createTime',
        width: 200,
    },
    {
        headerName: '修改人',
        field: 'updateName',
        width: 200,
    },
    {
        headerName: '修改时间',
        field: 'updateTime',
        width: 200,
    },
    {
        headerName: '布号',
        field: 'clothCode',
        width: 200,
    },
    {
        headerName: '状态',
        field: 'stockState',
        pinned: 'right',
        width: 150,
        cellRenderer: {
            template: `
                <a-space>
                    <el-tag type="success" class="gesture">入库</el-tag>
                </a-space>
            `,
            setup(props: any) {
                return {
                    stockState: props.params.data.stockState
                }
            }
        }
    },

]
const objectOP = reactive<{
    id: any,
    stockOutDate: any,
    stockOutTypeId: any,
    warehouseId: any,
    reckonPieceDate: any,
    stockOutTypeName: any,
    remark: any,
    stockOutCode: any,
    warehouseName: any,
    BlankStockOutDetail: any[],
    deliveryDepartmentId: any,
    deliveryDepartmentName: any,
    SHintypeName: any
}>
    ({

        id: null,
        stockOutDate: '',
        stockOutTypeId: 53,
        warehouseId: '',
        reckonPieceDate: '',
        stockOutTypeName: '染厂退库',
        remark: '',
        stockOutCode: '',
        warehouseName: '',
        BlankStockOutDetail: [],
        deliveryDepartmentId: null,
        deliveryDepartmentName: '',
        SHintypeName: ''

    });
const pageData = reactive<{
    dutymachineState: any,
    sideTitle: string,
    showAdd8: boolean,
    showAdd9: boolean
    pageLoading: boolean,
    dataList: any
    total: any
    pageType: string
    dataListOP: any



    stockOutCode: any,
    beginDate: any,
    endDate: any,
    nameList: any[],
    nameList1: any[],
    nameList2: any[],
}>({
    sideTitle: "新增退料出库",
    dutymachineState: 0,
    showAdd8: false,
    showAdd9: false,
    pageLoading: false,
    dataList: [],
    total: 0,
    pageType: '',
    dataListOP: [],

    stockOutCode: '',
    beginDate: '',
    endDate: '',
    nameList: [],
    nameList1: [],
    nameList2: [],
});
interface Querin {
    page: any
    size: any
    customOrderCode: Number | String
    custumName: Number | String
    greyName: Number | String
    greyCode: Number | String
    shelvesCode: Number | String
    storageName: Number | String
    inShelveName: Number | String
    companyId: Number | String
    warehouseId: Number | String
    stockState: any
    isDoes: boolean
    notInListKey: any[]
    clothCode: any
    circulatCard: any
    deliveryDepartmentId: any
}
let query = reactive<Querin>({
    page: 1,
    size: 10,
    greyCode: '',
    customOrderCode: '',
    custumName: '',
    storageName: '',
    inShelveName: '',
    shelvesCode: '',
    greyName: '',
    companyId: '',
    warehouseId: '',
    stockState: 1,
    isDoes: true,
    notInListKey: [],
    clothCode: '',
    circulatCard: '',
    deliveryDepartmentId: null
})
const editHandler = (record: any) => {
    for (var key in record) {
        objectOP[key] = record[key]
    }
    // objectOP.fastReverseState = record.fastReverseState
    // outList()
    post({
        url: "/dwWms/BlankStockOutDetail/getList",
        data: { stockOutId: record.id }
    }).then(({ code, data, message }: any) => {
        if (code === 200) {
            tableDataList1_2.value = data
        }
    });
    // console.log(objectOP.fastReverseState, record.fastReverseState, '人生得意须尽欢');

    pageData.sideTitle = '修改退料出库';
    pageData.showAdd8 = true;

}
const addHandler = () => {
    for (var key in objectOP) {
        if (key == "id") {
            objectOP[key] = null;

        } else {
            objectOP[key] = '';
        }
    }

    pageData.dataList = [];
    tableDataList1_2.value = [];
    tableDataList1.value = [];
    pageData.sideTitle = "新增退料出库";
    objectOP.stockOutTypeName = "染厂退库";
    objectOP.stockOutTypeId = 53;
    pageData.showAdd8 = true;
}
const selectHandler = () => {
    if (tabsKeys.value == 1) {
        doRefresh()
    } else if (tabsKeys.value == 2) {
        doRefresh1()
    }
}

const tabsKeys = ref(1)

const tabsChanges = (e: any) => {
    tabsKeys.value = e
    if (e == 1) {
        toolbarList.value = ['查询', '新增', '删除', '审核']
    } else if (e == 2) {
        toolbarList.value = ['查询', '导出']
    }
}
// 明细查询事件
const lookSet = (record: any) => {
    if (objectOP.warehouseName == '' || objectOP.deliveryDepartmentName == '') {
        // if (objectOP.circulatCard == '') {
        Message.error('请先输入仓库名称和送货单位！')
        return
    } {
        for (var key in query) {
            if (key == "id") {
                query[key] = null;

            } else {
                query[key] = '';
            }
        }
        query.isDoes = false
        pageData.nameList2.filter((o: any) => {
            if (o.warehouseName == objectOP.warehouseName) {
                query.warehouseId = o.id
            }
        })
        // query.warehouseId = objectOP.warehouseId
        query.page = 1
        query.size = 10
        // query.stockState = 1
        // getList()
        query.notInListKey = tableDataList1_2.value.map((o: any) => {
            return o.clothfiyCode
        })
        query.deliveryDepartmentId = objectOP.deliveryDepartmentId
        // console.log(query.notInListKey);
        visiblecg.value = true
        getList()
    }
}
// 明细删除事件
const delet = (record: any) => {
    if (gridOption1_2.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return;
    } else {
        let ob = gridOption1_2.value.getSelectedRows().map((o: any) => {
            return o.id
        })
        const filteredArr = tableDataList1_2.value.filter((item: any) => !ob.includes(item.id));
        tableDataList1_2.value = [...filteredArr]
        // console.log(tableDataList1_2.value, ob, '青青子衿悠悠我心');

    }
}
// 详情事件
const editHandler1 = (record: any) => {
    for (var key in record) {
        objectOP[key] = record[key]
    }
    objectOP.SHintypeName = objectOP.deliveryDepartmentName
    post({
        url: "/dwWms/BlankStockOutDetail/getList",
        data: { stockOutId: record.id }
    }).then(({ code, data, message }: any) => {
        if (code === 200) {
            tableDataList1_2.value = data
        }
    });
    pageData.showAdd9 = true;
}
const sideOk1 = () => {
    pageData.showAdd9 = false;
}
// 新增事件
const formRef = ref<FormInstance>();
const sideOk = () => {
    // let ob: any[] = []
    tableDataList1_2.value.forEach((o: any) => {
        o.id = ''
        // console.log(o.id, oa, '那是我，也不是我，是以前的我');
    })
    // console.log(ob, tableDataList1_2.value, '或许我就应该相信这才是缘分吧');
    pageData.nameList2.filter((o: any) => {
        if (o.warehouseName == objectOP.warehouseName) {
            objectOP.warehouseId = o.id
        }
    })
    objectOP.stockOutTypeId = 53
    objectOP.stockOutTypeName = '染厂退库'
    objectOP.BlankStockOutDetail = tableDataList1_2.value
    if (objectOP.deliveryDepartmentId == '' || objectOP.deliveryDepartmentName == '') {
        Message.error('请先填选送货单位！')
        return;
    } else {
        formRef.value?.validate().then((err) => {
            if (!err) {
                if (pageData.sideTitle === "新增退料出库") {
                    post({
                        url: "/dwWms/BlankStockOut/insertList",
                        data: objectOP
                    }).then((res: any) => {
                        if (res.code === 200) {
                            formRef.value?.resetFields();
                            pageData.showAdd8 = false;
                            Message.success({
                                content: "新增成功",
                                duration: 5000,
                            });
                            doRefresh();
                        } else {
                            Message.error({
                                content: res.message,
                                duration: 5000,
                            });
                        }
                    })
                } else {
                    post({
                        url: "/dwWms/BlankStockOut/updateList",
                        data: objectOP
                    }).then((res: any) => {
                        if (res.code === 200) {
                            formRef.value?.resetFields();
                            pageData.showAdd8 = false;
                            Message.success({
                                content: "修改成功",
                                duration: 5000,
                            });
                            doRefresh();
                        } else {
                            Message.error({
                                content: res.message,
                                duration: 5000,
                            });
                        }
                    })
                }
            }
        });
    }

}
// 收货来源下拉框下拉数据
const focusSel = () => {
    selCxAll({ "codeType": "" });
}
const options = ref<any>(pageData.nameList);
const loading = ref(false);
const handleSearch = (value: any) => {
    if (value) {
        const ob = { codeType: value, deleteState: 0 }
        loading.value = true;
        selCxAll(ob);
        options.value = pageData.nameList;
        loading.value = false;
    } else {
        options.value = []
    }
};
function selCxAll(val: any) {
    post({
        url: "/dict/dictTypeDetail/getList",
        data: { codeType: 30 }
    }).then(({ data, code }: any) => {
        if (code === 200) {
            pageData.nameList = data;
        } else {
            Message.error({
                content: "查询失败！",
                duration: 5000,
            });
        }
    });
}
// 客户名称下拉框下拉数据
const focusSel1 = () => {
    selCxAll1({ "customName": "" });
}
const options1 = ref<any>(pageData.nameList1);
const loading1 = ref(false);
const handleSearch1 = (value: any) => {
    if (value) {
        const ob = { customName: value, deleteState: 0 }
        loading1.value = true;
        selCxAll1(ob);
        options1.value = pageData.nameList1;
        loading1.value = false;
    } else {
        options1.value = []
    }
};
function selCxAll1(val: any) {
    post({
        url: "/aps/custom/getDropValue",
        data: val
    }).then(({ data, code }: any) => {
        if (code === 200) {
            pageData.nameList1 = data;
        } else {
            Message.error({
                content: "查询失败！",
                duration: 5000,
            });
        }
    });
}
// 仓库下拉框下拉数据
const focusSel2 = () => {
    selCxAll2({});
}
const options2 = ref<any>(pageData.nameList2);
const loading2 = ref(false);
const handleSearch2 = (value: any) => {
    if (value) {
        const ob = { deleteState: 0 }
        loading2.value = true;
        selCxAll2(ob);
        options2.value = pageData.nameList2;
        loading2.value = false;
    } else {
        options2.value = []
    }
};
function selCxAll2(val: any) {
    post({
        url: "/dwWms/warehouse/getWarehouseByPara",
        data: val
    }).then(({ data, code }: any) => {
        if (code === 200) {
            pageData.nameList2 = data;
        } else {
            Message.error({
                content: "查询失败！",
                duration: 5000,
            });
        }
    });
}

// 未审核页面审核方法
const audits = () => {
    if (gridOption.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return;
    }
    Modal.confirm({
        title: '系统提示',
        content: '是否审核此订单',
        onOk() {
            post({
                url: "/dwWms/BlankStockOut/setAudit",
                // data: auditStateId,
                data: gridOption.value.getSelectedRows().map((item: any) => {
                    return { id: item.id, auditState: 1 }
                })
            }).then((res: any) => {
                if (res.code === 200) {
                    doRefresh();
                    Message.success('审核通过')
                    // selectedRowKeys.value = []
                } else {
                    Message.error(res.message)
                }
            })
        }
    })
}
// 删除事件
const deleteHandler = () => {
    if (gridOption.value.getSelectedRows().length === 0) {
        Message.error('请先勾选')
        return;
    }
    Modal.confirm({
        title: "系统提示",
        content: "确认删除选中的数据?",
        onOk() {
            post({
                url: "/dwWms/BlankStockOut/delete",
                data: gridOption.value.getSelectedRows().map((o: any) => { return o.id })
            }).then(({ code, data, message }: any) => {
                if (code === 200) {
                    Message.success({
                        content: "删除成功",
                        duration: 5000,
                    });

                    pagination.page = 1
                    doRefresh();

                } else {
                    Message.error({
                        content: '删除失败',
                        duration: 5000,
                    });
                }

            });
        },
    });
};
// 未审核查询事件
const total = ref(10);
const total1 = ref(10);
const pagingList1: any = ref(pagingList)
const page = ref(1);
const size = ref(10);
function doRefresh() {
    pageData.pageLoading = true
    post({
        url: "/dwWms/BlankStockOut/getPage",
        data: {
            page: pagination.page,
            size: pagination.pageSize,
            stockOutTypeId: 53,
            stockOutCode: pageData.stockOutCode,
            beginDate: pageData.beginDate,
            endDate: pageData.endDate,
            auditState: 0,
            deleteState: 0,
        },
    })
        .then(({ data, code }: any) => {
            if (code === 200) {

                table.handleSuccess(data.list);
                gridOption.value.setRowData(data.list)
                total.value = data.total;

            }
        })
        .catch(console.log).finally(() => {
            pageData.pageLoading = false
        })
}
// 已审核查询
function doRefresh1() {
    pageData.pageLoading = true
    post({
        url: "/dwWms/BlankStockOut/getPage",
        data: {
            page: pagination.page,
            size: pagination.pageSize,
            stockOutTypeId: 53,
            stockOutCode: pageData.stockOutCode,
            beginDate: pageData.beginDate,
            endDate: pageData.endDate,
            auditState: 1,
            deleteState: 0,
        },
    })
        .then(({ data, code }: any) => {
            if (code === 200) {

                table.handleSuccess(data.list);
                // gridOption2.value.setRowData(data.list)
                pageData.dataListOP = data.list
                total1.value = data.total;

            }
        })
        .catch(console.log).finally(() => {
            pageData.pageLoading = false
        })
}
const { selectedRowKeys, onSelectionChange } = useRowSelection();
const pagination = usePagination(doRefresh);
const pagination2 = usePagination(doRefresh1);
const table = useTable();
const rowKey = useRowKey("id");





// 弹窗明细数据查询事件
let loadingElplus = ref<boolean>(false)
const getList = async () => {
    try {
        loadingElplus.value = true
        let { code, data, message } = await post({
            url: '/dwWms/BlankStock/getPage',
            data: query,
        })
        if (code && code == 200) {
            pageData.dataList = data.list
            pageData.total = data.total
            loadingElplus.value = false
            return
        }
        pageData.dataList = []
    } catch {
        pageData.dataList = []
    } finally {
        loadingElplus.value = false
    }
}
const changeSize = (val: any) => {
    query.size = val
    getList()
}

let visiblecg = ref(false)
const print = () => {
    // let oa = ''
    // gridOption1.value.getSelectedRows().map((o: any) => {
    //     return oa = o.id
    // })
    // console.log(oa, '是谁的心啊孤单的留下');

    let ob: any[] = []
    ob = tableDataList1_2.value
    gridOption5.value.getSelectedRows().map((o: any) => {
        // o.matchBatchGreyId = oa;
        ob.push(o)
    })
    tableDataList1_2.value = [...ob]
}
</script>
<script lang="ts">
export default {
    name: "MaopiChuku2",
}
</script>
<style scoped lang="less">
:deep(.ag-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-header-cell) {
    border-right: 1px solid #dde2eb;
}

:deep(.ag-cell-value) {
    user-select: initial;
    -moz-user-select: text;
    -ms-user-select: text;
    -webkit-user-select: text;
}
</style>
